﻿<template>
    <div id="sider">
        <div v-if='isLogin'>
        <Card >
            <p slot="title" style="color:#666">
                用户名<span @mouseenter="enter($event)" @mouseleave="leave($event)" class="msp1" style="margin: 0 0 0 3px;">{{userInfo.userName}}</span><span style="float:right;color:#999;font-size:12px;">已发布<strong style="color:#339AFF">{{userInfo.publicSum}}</strong>次公示</span>
            </p>
        </Card>
        <Row style="margin:10px 0;border:none;">
            <Col span="11" style="text-align:center">
            <Button type="primary" @click="editorPublic" long style="padding: 10px 0">
                发布
            </Button>
            </Col>
            <Col span="11" style="text-align:center" offset="2">
            <Button type="primary" long style="padding: 10px 0" @click="jumpMange">
                管理
            </Button>
            </Col>
        </Row>
        </div>
        <div v-if="showList">
            <Card >
                <p slot="title" style="color:#666;">
                    热门公示
                </p>
                <ul class="rul">
                    <li v-for="item in publicityList" :key='item.Id' @click="publicDetails(item.Id)">
                            <p :title="item.Title" :data-publicState="item.ProjectType" >{{item.Title}}</p>
                        <span :title="item.PublicityTime|formatDate1">{{item.PublicityTime|formatDate1}}</span>
                    </li>
                </ul>
            </Card>
            <Card style="margin-top:20px">
                <p slot="title" style="color:#666;">
                    环保法律法规数据库>>
                </p>
                <div style="overflow:hidden;">
                    <a href="https://social.anhuanjia.com/laws" target="_blank"><img src="../../../assets/img/gslaw.jpg" alt="" width="100%;height:100%;"></a>
                </div>
            </Card>
        </div>
        <Card v-else>
            <p slot="title" style="color:#666;">
                项目信息
            </p>
            <div style="padding:15px;">
                <p>项目名称</p>
                <p>{{projectInfo.ProjectName}}</p>
                <p>建设单位名称</p>
                <p>{{projectInfo.BuildUnit}}</p>
                <p>建设单位地址</p>
                <p>{{projectInfo.BuildAddress}}</p>
                <p>建设单位联系人<p>
                <p>{{projectInfo.Linkman}}</p>
                <p>建设单位联系电话</p>
                <p>{{projectInfo.TelNumber}}</p>
                <p>评价单位名称</p>
                <p>{{projectInfo.FullName}}</p>
            </div>
        </Card>



    </div>
</template>

<script>
    import {formatDate} from '../../../libs/tools';
    import libs from '../../../libs/upload';
    export default {
        data() {
            return {
                publicityList:[],
            }
        },
        computed: {
            isLogin() {
                return this.$store.state.isLogin
            },
            showList() {
                if(this.$route.path == "/home/PublicEditor") {
                    return false
                }else {
                    return true
                }
            },
            // 项目信息展示
            projectInfo() {
                return this.$store.state.projectInfo
            },
            // 登录人信息
            userInfo() {
                return this.$store.state.userInfo
            }
        },
 	created (){
          axios.get(libs.uploads() + "member/islogin")
    		// axios.get("/member/islogin")
      		.then(res => {
       		 if(res._STATUS==0){
          	// location.href = 'http://accounts.ahjdev.top/login/identifier?referer=http://localhost'
            	this.$store.state.isLogin = false;
            	window.localStorage.clear();
        	 }
      		});
        },
        mounted() {
            this.getHot();
		
    		
  	},
       
        filters:{
            formatDate1(time){
              let date = new Date(time);
                return formatDate(date,'yyyy-MM-dd');
            }
        },
        methods: {
 	    enter($event){
		$event.currentTarget.className="msp2";	
	    },
	    leave($event){
		$event.currentTarget.className="msp1";
	    },
            // 发布按钮-编缉公示
            editorPublic() {
                this.$store.commit('toggleHotId','')
                this.$router.push({name: 'PublicEditor'})
            },
            instance(type) {
                const title = '发布成功';
                const content = '<p>3s后自动退出</p>';
                 this.$Modal.success({
                    title: title,
                    content: content
                });
            },
            // 项目信息展示
            getProjectInfo() {

            },
            // 热门公示
            getHot(){
                this.$post('publicity.getHot',{}).then((res) => {
                    console.log(res)
                    this.publicityList = res.publicityList
                }).catch((err) => {
                    console.log(err)
                })
            },
            // 跳转详情
            publicDetails (id) {
                this.$store.commit('toggleHotId',id+'hotSort')
                this.$router.push({name: 'PublicDetials'})
            },
            // 跳转管理
            jumpMange() {
                this.$router.push({name: 'MangePublic'})
            }
        },
    }
</script>

<style lang="less">
    #sider {
        background: #fff;
	 .msp1 {
	  display: inline-block;
          overflow: hidden;
          text-overflow:ellipsis;
          white-space:nowrap;
          width:70px;
        }
	.msp2{
	    position: absolute;
	    background: #fff;
	    border:1px solid #eee;
	    padding: 6px;
	    top:5px;
	    border-radius: 6px;
	}
        .ivu-card-head {
            background: #f8f8f9;
        }
        .rul{
            padding:20px 10px 20px 30px;//上右下左
        }
        .rul li{
            padding-left: 3px;
            padding-bottom: 5px;
            list-style-image:url("../../../assets/img/yd.png");
            cursor: pointer;
        }
        .rul li p{
            padding-bottom: 5px;
            width:60%;
            float:left;
            overflow:hidden;
            text-overflow:ellipsis;
            white-space:nowrap;
            font-size:12px;
            font-weight:700;
        }
        .rul li span{
           padding-bottom: 5px;
             float:right;
             width:35%;
               overflow:hidden;
            text-overflow:ellipsis;
            white-space:nowrap;
             font-size:12px;
             color: #BFBFBF;
             font-weight:700;
        }
        .rul li:hover{color:blue}
    }
    .list li:before{ content:''; width:4px; height:4px; border-radius:50%; background:#000; display:inline-block; margin-right:5px; vertical-align:middle; margin-top:-3px;}
</style>
